<!--<template>-->

<!--  <h3 @click="$router.push('/login')">Login</h3>-->
<!--  <br>-->

<!--  &lt;!&ndash;  考虑一个问题就是整体布局的问题. 第一、从左到右  第二、从上到下. &ndash;&gt;-->
<!--  &lt;!&ndash;  感觉应该是从左到右稍微好做一点. 只不过需要使用全局的状态管理.&ndash;&gt;-->
<!--  &lt;!&ndash;   顶部包含头像 搜索 名称(聊天框).&ndash;&gt;-->
<!--  <div>-->
<!--    &lt;!&ndash; 头像.&ndash;&gt;-->

<!--    &lt;!&ndash;    div行内&ndash;&gt;-->

<!--    <div class="head_img general">-->

<!--    </div>-->

<!--    <div class="search_friend general">-->

<!--    </div>-->

<!--    <div class="show_name general">-->

<!--    </div>-->

<!--  </div>-->
<!--</template>-->

<!--<script>-->

<!--export default {-->
<!--  name: "Top",-->
<!--}-->
<!--</script>-->

<!--<style scoped>-->

<!--/*高度和div行内快是通用的*/-->
<!--.general {-->
<!--  display: inline-block;-->
<!--  height: 75px;-->
<!--}-->

<!--.head_img {-->
<!--  width: 40px;-->
<!--  background-color: pink;-->
<!--}-->

<!--.search_friend {-->
<!--  width: 108px;-->
<!--  background-color: red;-->
<!--}-->

<!--.show_name {-->
<!--  width: 108px;-->
<!--  background-color: red;-->
<!--}-->

<!--</style>-->